<template>
  <div class="hello">
    <h3>Installed CLI Plugins</h3>
    <el-dialog
      title="测试"
      width="600px"
      :visible.sync="visible"
      :before-close="close">
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  data () {
    return {
      visible: false
    }
  },
  created() {
    this.haha()
  },
  methods: {
    async haha() {
      const res = await this.getData()
      if (res.data.list.length !== 0) {
        if (localStorage.getItem('look') !== null) {
          this.visible = false
        } else {
         this.visible = true
        }
      } else {
        this.visible = true
      }
    },
    getData () {
      return new Promise((resolve, reject) => {
        // $.ajax({
        //   url: '/user/test',
        //   success: function (data) {
        //     resolve(JSON.parse(data))
        //   },
        //   error: function (error) {
        //     reject(error)
        //   }
        // })
        this.$utils.getJson('/user/test', function (res) {
          resolve(res)
        }, function (error) {
          reject(error)
        }, {}, false, {}, 'get',{})
      })
    },
    close () {
      localStorage.setItem('look', 'look')
      this.visible = false
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h3 {
  margin: 40px 0 0;
}
ul {
  list-style-type: none;
  padding: 0;
}
li {
  display: inline-block;
  margin: 0 10px;
}
a {
  color: #42b983;
}
</style>
